<%@page import="com.wanmait.cookBook.vo.Pager"%>
<%@page import="java.text.SimpleDateFormat"%>
<%@page import="com.wanmait.cookBook.vo.Comment"%>
<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%String path = request.getContextPath(); %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>



<!-- 评论区 -->
	<div class="ui_title_wrap clear" style="margin-bottom:20px">



<!-- 获取评论数量 -->
<% int count = (int)request.getAttribute("count"); %>
<%int diaryId  = (int)request.getAttribute("diaryId"); %>
<%int userinfoId = (int)request.getAttribute("userinfoId"); %>
<h3 class="on"><a order="hot" data="0" page="2" href="">|最新评论</a></h3>
<h3 class=""><a order="hot" data="0" page="2" href="">(<%=count%>条)</a></h3>
</div>	
		
		<% ArrayList<Comment> getAllCookComment = (ArrayList<Comment>)request.getAttribute("getAllDiaryComment"); %>
		<%if(count==0)
		{
		%>
			<div id="arInfo" style="margin-top">						
			  	 <span ><font size="4">快来发布第一条评论吧~</font></span>  				            						
			 </div>		
		<%			
		}%>
		<%for(Comment comment:getAllCookComment)
		{
		%>
		
				<!-- 时间 -->
				
					<div id="arInfo" style="margin-top">						
						 <a> <img width="40px" height="40px" style="border-radius:30px;" src="<%=path%>/front/userImages/<%=comment.getFromUser().getUserFace()%>"></a>
						 <span ><a href=""><font size="4"><%=comment.getFromUser().getUserName() %></font> </a></span>  
							<% SimpleDateFormat formatt = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
				 			 String timex = formatt.format(comment.getCommentTime());%> 
		      				 <%=timex %>
						<span style="margin-right:10px"><a commentId="<%=comment.getId()%>"  class="replay" href="javascript:void(0)">回复</a></span>			            						
					</div>		
				<!-- 内容 -->	
				<%if(comment.getToUser().getUserName()!=null)
				{
				%>
					<div class="content 224252">
						<p><font size="3"><%=comment.getFromUser().getUserName()%>回复<%=comment.getToUser().getUserName()%>:<%=comment.getCommentContent() %></font></p>
					</div>
				<% 	
				}
				%>
				<%if(comment.getToUser().getUserName()==null) 
				{
				%>
						<div class="content 224252">
							<p><font size="3"><%=comment.getCommentContent() %></font></p>
						</div>
				<% 
				}
				%>	
					<div class="onlineReplay" style="display:none">
								<div style="clear:both;">
									<textarea id="<%=comment.getId() %>"  name="replayContent"  ></textarea>
									<input commentId=<%=comment.getId() %> toUser=<%=comment.getFromUser().getId()%> type="button" class="addReplay" value="回复" style="margin:10px 0; margin-left:0px;">									
								</div>							
							</div>
							<hr>
		<% 	
		} 
		%>
	


<!-- 给回复增加事件 -->
<script type="text/javascript">
$(function(){
	$(".replay").click(function(){
		$(".onlineReplay").css("display","none");
		var commentId = $(this).attr("commentId");
		$(this).parent().parent().next().next().css("display","block");
		//替换在线编辑器
		
		var items = {
				initialFrameWidth:600,//在线编辑器的宽度和高度
				initialFrameHeight:170,
				toolbars:[['source','bold','|','underline','forecolor','map','emotion','undo','redo','indent','insertimage','map',],['simpleupload','forecolor','backcolor','scrawl','justifyleft', ]]//工具栏 有2行
					}
		ReplayEditor = UE.getEditor(commentId,items);
		
	
	});//点击回复事件结束
})

 //发布回复
 $(function(){
	 $(".addReplay").click(function(){
		 var loginuser = <%=userinfoId%>;
		 var diaryId = <%=diaryId%>;
		 var content = ReplayEditor.getContent();
		 var toUser = $(this).attr("toUser");
		if("null"==loginuser)//js是否为空比较 "null"
		{
			location.href  = "<%=path%>/front/login.jsp";
			return;
		}
		if(content=="")
		{
		 	swal("评论不能为空呦~");	
		}
		if(content!="")
		{
			$.ajax({
				url:"<%=path%>/CommentServlet",
				async:false,
				data:{diaryId:diaryId,content:content,action:"diaryReplay",toUser:toUser},
				type:"post",
				success:function(mes)
					{
						$("#commentDiary").html(mes);
					}
			});//ajax结束
		}	 
	 });//点击按钮结束
 })
</script>	

<!-- -------------------分页------------------- -->
		
				<%Pager pager = (Pager)request.getAttribute("pager"); %>
				<div class="ui-page mt20"  id="pagerpager">
				<div class="ui-page-inner" id="pagerxx">	
					<a href="<%=path%>/DiaryServlet?action=showDiary&pageNo=<%=pager.getPageNo()-1%>&diaryId=<%=diaryId%>">上一页</a>
				
					<% for(int i =1;i<=pager.getPageCount();i++)
					{
					%>	
							<a class="no<%=i%>" href="<%=path%>/DiaryServlet?action=showDiary&diaryId=<%=diaryId%>&pageNo=<%=i%>"><%=i%></a>
					<%
					}
					%>				
						<a href="<%=path%>/DiaryServlet?action=showDiary&pageNo=<%=pager.getPageNo()+1%>&diaryId=<%=diaryId%>">下一页</a>	
				</div>
				</div>
				
<!-- 改变颜色的事件 -->
<script type="text/javascript">
	$(function(){
		$(".no<%=pager.getPageNo()%>").css("color","red");
	})
</script>







</body>
</html>